<!DOCTYPE html>
<html>
<head>
	<title>HUATHY-skyDrive</title>
	<link rel="stylesheet" type="text/css" href="css/basic.css">
	<link rel="stylesheet" type="text/css" href="./layui/css/layui.css">
	<script type="text/javascript" src="./js/jquery-3.4.1.js"></script>
	<script type="text/javascript" src="./js/layer.js"></script>
</head>
<body>
<header id="header" class="header">
	<h1>HUATHY-skyDrive</h1>
	<hr>
</header>


<div class="layui-container" id="controll">  
<div class="layui-row">
	<div class="layui-col-xs6 layui-col-sm4 layui-col-md4">
		当前用户 : <font size="3"><a onclick="myUpload();" id="user" style="cursor:pointer;">未登录</a></font>
		<br>(点击用户名查看上传的文件)
	</div>
	<div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
		<form id="uploadForm">
			<input type="file" name="file" id="file">
			<input id="uid" name="uid" hidden value="0"/>	<!-- 将uid隐藏在这方便后边一起将数据提交服务器 -->
			<button type="button" id="fileUploadBtn" class="layui-btn layui-btn-warm">上传资源</button>
		</form>
	</div>
	<div class="layui-col-xs6 layui-col-sm2 layui-col-md2">
		<button id="showLoginBtn" class="layui-btn layui-btn-normal">登录</button>
		<button id="showRegBtn" onclick="showReg();" class="layui-btn ">注册</button>
	</div>
	
</div>
</div>

<span style="text-align:center;"><h1>——资源列表——</h1></span>
<table class="layui-table" id="fileTable">
	<thead>
		<tr>
			<th>文件名称</th>
			<th>点击下载-文件预览</th>
			<th>文件大小</th>
			<th>上传者</th>
		</tr> 
	</thead>
	<tbody id="file_tbody">
		
	</tbody>
</table>


<footer id="footer" class="footer">
	<span> 
		<span style="margin-left: 20%;"></span>
	</span>
</footer>

<footer class="layui-container" id="footer">  
<div class="layui-row">
	<div class="layui-col-xs8 layui-col-sm6 layui-col-md6">
		<b>©AUTHOR：HUATHY </b> &emsp;博客地址：<a target="_blank" href="https://blog.csdn.net/qq_40366738">https://blog.csdn.net/qq_40366738</a>
	</div>
	<div class="layui-col-xs4 layui-col-sm6 layui-col-md6">
		本站访问人数 : <span>暂未统计</span>
	</div>
</div>
</footer>
</body>
<script type="text/javascript">
/******** 获取资源信息 ********************************************/
$(function(){
	var host = location.host;
	$.post('file/get',null,function(data){
		var str = '';
		$.each(data,function(index,item){
			var path = item.savepath.split('files/')[1] ;
			str += '<tr> <th>'+item.filename+'</th> <th><a href="'+item.savepath+'" download="" >'+ path +'</a>'
			if('image'==fileType(item.filename)){
				str += '<img style="float:right;height:28px;width=28px;" src="'+item.savepath+'">'
			}else if('audio'==fileType(item.filename)){
				str += '<audio style="float:right;height:28px;width=28px;" controls src="'+item.savepath+'" />'
			}else if('video'==fileType(item.filename)){
				str += '<video style="float:right;height:48px;width=56px;" controls src="'+item.savepath+'" />'
			}else{
				str += '<a style="float:right;" href="'+item.savepath+'" >无法预览\n点击下载<a/>'
			}
			
			str += '<th>'+(item.size/1024).toFixed(2)+' K</th><th>'+item.email+'</th> </tr>';
		});
		$("#file_tbody").html(str);
	},'json');
	$.post("user/checkLogin",null,function(data){
		if( data.uid > 0 ){
			$("#user").html(data.email);
			$("#uid").val(data.uid);
		}
	});
})


/******** 文件上传的方法 *************************************/
$('#fileUploadBtn').click(function fileUpload(){
	var uid = $("#uid").val();
	if(uid == '' || uid<=0){
		layer.msg('请先登录。。。');
		setTimeout(function(){
			$("#loginBtn").click();
		},800);
		return;
	}
	
	var fl = $('#file')[0].value;
	
	if( !fl ){
		layer.msg('操作失误，请选择需要上传的文件...');
		return ;
	}
	
	var formData = new FormData($('#uploadForm')[0]);
	
	var index = layer.load(1, {shade: false}); //显示等待图标。。
	layer.msg('文件上传中...');		//提示
	
	$.ajax({
		type : 'post' ,
		url : 'file/upload' ,
		data : formData ,
		cache : false ,
		processData : false,
		contentType : false,
		success : function(data,status){
			data = parseInt($.trim(data));
			layer.closeAll();	//关闭所有窗口
			if( data > 0 ){
				layer.msg('上传成功😀，待管理员审核...');
				$('#uploadForm')[0].reset();
			}else if( data == -2 ){
				layer.msg('上传失败-请选择需要上传的文件..');
			}else if( data == -3 ){
				layer.msg('请先登录，后再上传文件..');
				setTimeout(function(){
					$('#showLoginBtn').click();
				},800);
			}else if( data == -4 ){
				layer.msg('该文件已存在，请勿重复上传！！');
			}else{
				layer.msg('上传失败😭');
			}
			
		},
		error : function(data,status,e){
			layer.closeAll();	//关闭所有窗口
			layer.alert('上传失败'+e +"\n 本站最大文件上传大小为100M，请检查上传文件大小..");
		}
	});
	return false;
});

/*******查看我上传到资源****************************************************/
function myUpload(){
	var uid = $("#uid").val();
	if( uid==null || uid<=0 ){
		return ;
	}
	var myfile = '<table class="layui-table" id="source"><thead><tr><th>文件名</th><th>路径</th><th>状态</th></tr></thead>';
	$.post('file/myUpload',{uid:uid},function(data){
		console.log(data);
		if(data==null || data==''){
			layer.msg('您没有上传过文件..');
		}else{
			$.each(data,function(index,item){
				var status = item.statu > 0 ? '审核通过' : '待审核';
				myfile += '<tbody><tr><td>'+item.filename+'</td><td><a href="'+item.savepath+'">'+item.savepath+'</a></td><td>'+status+'</td></tr></table>';
			});
				//页面层
			layer.open({
			  type: 1,
			  title: '我上传的文件',
			  shadeClose: true,
			  shade: 0.8,
			  area: ['96%', '96%'],
			  content: myfile //iframe的url
			}); 
		}
	},'json')
}

/***********登录注册弹出框***************************************/
$("#showLoginBtn").click(function(){
	showLogin();
});
function showLogin(){
	var loginHtml = '<form class="layui-form" id="loginForm"><div class="layui-form-item">' 
	+ '<input type="text" name="email" id="login_email" lay-verify="required" placeholder="请输入邮箱" autocomplete="off" class="layui-input" style="width:90%;margin-left:6%;margin-top:2%;">' 
	+ '<input type="password" name="pwd" id="login_pwd" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input" style="width:90%;margin-left:6%;margin-top:2%;">'
	+ '<input type="button" id="loginBtn" onclick="login()" class="layui-btn" value="登录" style="width:80%;margin-left:4%;margin-top:2%;"/></div></form>'
	+ '<a style="float:right;" onclick="layer.closeAll();showReg();"><b>点击立即注册..</b></a>';
	//页面层
	layer.open({
		type: 1,
		skin: 'layui-layer-rim', //加上边框
		area: ['380px', '260px;'], //宽高
		content: loginHtml
	});
	
}
/***登录的方法****************************************************/
function login(){
	var email = $("#login_email").val();
	var pwd = $("#login_pwd").val();
	if( email=='' || pwd=='' ){
		layer.msg('账号密码不可为空...');
		return;
	}
	
	$.ajax({
		url : 'user/login',
		data : $("#loginForm").serialize(),
		type : 'post' ,
		dataType : 'json' ,
		success : function(data){
			if(data.uid > 0){
				layer.msg('登录成功...');
				$("#user").html(data.email);
				$("#uid").val(data.uid);
				layer.closeAll();
			}else {
				layer.alert('登录失败! 账号或密码错误..', {
					icon: 5,
					skin: 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则，去这里查阅
				})
			}
		},
		error : function(data,status,e){
			layer.msg("登录失败\n e:"+e);
		}
	});
}

function showReg(){
	var regHtml = '<form class="layui-form" id="regForm" style="align:center;text-align:center;width:90%;"><div class="layui-form-item">' 
		regHtml += '<input type="email" name="email" id="reg_email" lay-verify="required" placeholder="请输入邮箱" autocomplete="off" class="layui-input" style="margin-left:6%;margin-top:2%;">' 
		regHtml += '<input type="password" name="pwd" id="reg_pwd" lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input" style="margin-left:6%;margin-top:2%;">'
		regHtml += '<input type="text" name="pwd" id="reg_code" lay-verify="required" placeholder="请输入验证码" autocomplete="off" class="layui-input" style="margin-left:6%;margin-top:2%;">'
		regHtml += '<a class="layui-btn layui-btn-xs layui-btn-warm" style="margin-top:2%;float:right;" id="sendCodeBtn" onclick="sendCode()">点击获取验证码</a>'
		regHtml += '<input type="button" id="regBtn" onclick="reg()" class="layui-btn" value="注册" style="width:80%;margin-left:4%;margin-top:2%;"/></div></form>'
		regHtml += '<div style="align:center;text-align:center;width:84%;padding-left:8%;"><font color="red" >本网盘所有资源公有，内容所有用户可见！请勿上传违法违规及隐私内容！注册即默认同意以上条款！</font></div>';
	//regHtml = '<div style="text-align:center"><h1>暂不开放注册! 请联系管理员...</h1><h1>QQ:1416102787</h1><font color="red">不想写了😜😜😜，哈哈哈😁😁😁</font></div>';
	
	layer.open({
		type: 1,
		skin: 'layui-layer-rim', //加上边框
		area: ['420px', '360px;'], //宽高
		content: regHtml
	});
}
/****发送验证码的方法****************************************/
function sendCode(){
	$("#sendCodeBtn").attr("class","layui-btn layui-btn-xs layui-btn-disabled");
	$("#sendCodeBtn").attr("onclick","return false");
	var email = $('#reg_email').val();
	if( email == null || email == '' ){
		layer.msg('请输入邮箱..');
		$("#sendCodeBtn").attr("class","layui-btn layui-btn-xs layui-btn-warm");
		$("#sendCodeBtn").attr("onclick","sendCode()");
		return;
	}
	$.post("user/code",{email:email},function(data){
		console.log(data);
		data = parseInt($.trim(data));
		if(data == 1){
			layer.msg('验证码发送成功,请前往邮箱查看...');
			var time = 180;
			var itv1 = setInterval(function(){ 
				$("#sendCodeBtn").html((time)+"秒");
				time--;
			 }, 1000);
		}else{
			layer.msg('验证码发送失败，请稍后重试...');
			$("#sendCodeBtn").html("点击重新获取验证码");
			$("#sendCodeBtn").attr("class","layui-btn layui-btn-xs layui-btn-warm");
			$("#sendCodeBtn").attr("onclick","sendCode()");
		}
	});
	return;
}
/***********************************************/
function reg(){
	var email = $('#reg_email').val();
	if( email == null || email == '' ){
		layer.msg('请输入邮箱..');
		return;
	}
	var pwd = $('#reg_pwd').val();
	if( pwd == null || pwd == '' ){
		layer.msg('请输入密码..');
		return;
	}
	var code = $('#reg_code').val();
	if( code == null || code == '' ){
		layer.msg('请输入注册码..');
		return;
	}
	$.post("user/reg",{
		email : email,
		pwd : pwd,
		code : code
	},function(data){
		data = parseInt($.trim(data));
		if(data > 0){
			layer.closeAll();
			layer.msg('注册成功...');
		}else if(data == -2){
			layer.msg('您输入的信息不完整...');
		}else if(data == -3){
			layer.msg('验证码已过期,请重新获取...');
			$("#sendCodeBtn").html("点击重新获取验证码");
			$("#sendCodeBtn").attr("class","layui-btn layui-btn-xs layui-btn-warm");
			$("#sendCodeBtn").attr("onclick","sendCode()");
		}else if(data == -4){
			layer.msg('您输入的验证码错误...');
		}else{
			layer.msg('注册失败,请稍后重试...');
			$("#sendCodeBtn").html("点击重新获取验证码");
			$("#sendCodeBtn").attr("class","layui-btn layui-btn-xs layui-btn-warm");
			$("#sendCodeBtn").attr("onclick","sendCode()");
		}
	});
}

/*********封装文件格式判断**************************************************************************/
function fileType(filePath){
	//获取最后一个.的位置
	var index= filePath.lastIndexOf(".");
	//获取后缀
	var ext = filePath.substr(index+1);

	//判断是否是视频类型
	if(['mp4','avi','mov','rmvb','rm','flv','3gp'].indexOf(ext.toLowerCase()) != -1){
		return 'video';
	}
	//判断是否是图片类型
	if(['png', 'jpg', 'jpeg', 'bmp', 'gif', 'webp', 'psd', 'svg', 'jfif'].indexOf(ext.toLowerCase()) != -1){
		return 'image';
	}
	//判断是否是音频类型
	if(['cda','wav','mp3','wmv','flac','aac'].indexOf(ext.toLowerCase()) != -1){
		return 'audio';
	}
	return 'other';
}

</script>
</html>